
<html lang="ja">
<head>
<meta charset="utf-8">
<style type="text/css">
	#svgicon {
		width: 0; height: 0; overflow: hidden;
	}
	body {
		padding: 0;
		margin: 0;
		font-family: sans-serif;
		font-size: 1em;
		line-height: 1.5;
		color: #231815;
		background: #fff;
	}
	ul {
		font-size: 30px;
		list-style-type: none;
	}
	.cb {
		display: inline-block;
		width: 1em;
		height: 1em;
		vertical-align: middle;
		fill: currentColor;
	}
	.cb-images {
		width: 1.125em;
	}
	.icon-bg {
		fill: #d4d4d5;
	}
	.icon-with-bg {
		fill: #fff;
	}
	#cb-user-circle .icon-bg {
		fill: #b5bbc1;
	}
</style>
</head>
<body>

<header>
	<h1>EC-CUBE SVG icons (for admin)</h1>
</header>

<ul>
    <li>
        <svg class="cb cb-angle-down">
          <use xlink:href="#cb-angle-down" />
        </svg>
        <span> cb-angle-down</span>
    </li>
    <li>
        <svg class="cb cb-angle-right">
          <use xlink:href="#cb-angle-right" />
        </svg>
        <span> cb-angle-right</span>
    </li>
    <li>
        <svg class="cb cb-search">
          <use xlink:href="#cb-search" />
        </svg>
        <span> cb-search</span>
    </li>
    <li>
        <svg class="cb cb-shopping-cart">
          <use xlink:href="#cb-shopping-cart" />
        </svg>
        <span> cb-shopping-cart</span>
    </li>
    <li>
        <svg class="cb cb-user-circle">
          <use xlink:href="#cb-user-circle" />
        </svg>
        <span> cb-user-circle</span>
    </li>
    <li>
        <svg class="cb cb-question">
          <use xlink:href="#cb-question" />
        </svg>
        <span> cb-question</span>
    </li>
    <li>
        <svg class="cb cb-warning">
          <use xlink:href="#cb-warning" />
        </svg>
        <span> cb-warning</span>
    </li>
    <li>
        <svg class="cb cb-eye">
          <use xlink:href="#cb-eye" />
        </svg>
        <span> cb-eye</span>
    </li>
    <li>
        <svg class="cb cb-ellipsis-h">
          <use xlink:href="#cb-ellipsis-h" />
        </svg>
        <span> cb-ellipsis-h</span>
    </li>
    <li>
        <svg class="cb cb-ellipsis-v">
          <use xlink:href="#cb-ellipsis-v" />
        </svg>
        <span> cb-ellipsis-v</span>
    </li>
    <li>
        <svg class="cb cb-chart">
          <use xlink:href="#cb-chart" />
        </svg>
        <span> cb-chart</span>
    </li>
    <li>
        <svg class="cb cb-clock">
          <use xlink:href="#cb-clock" />
        </svg>
        <span> cb-clock</span>
    </li>
    <li>
        <svg class="cb cb-cog">
          <use xlink:href="#cb-cog" />
        </svg>
        <span> cb-cog</span>
    </li>
    <li>
		<svg class="cb cb-comment">
			<use xlink:href="#cb-comment" />
        </svg>
        <span> cb-comment</span>
	</li>
    <li>
        <svg class="cb cb-file-text">
          <use xlink:href="#cb-file-text" />
        </svg>
        <span> cb-file-text</span>
    </li>
    <li>
        <svg class="cb cb-folder">
          <use xlink:href="#cb-folder" />
        </svg>
        <span> cb-folder</span>
    </li>
    <li>
        <svg class="cb cb-folder-open">
          <use xlink:href="#cb-folder-open" />
        </svg>
        <span> cb-folder-open</span>
    </li>
    <li>
        <svg class="cb cb-home">
          <use xlink:href="#cb-home" />
        </svg>
        <span> cb-home</span>
    </li>
    <li>
        <svg class="cb cb-inbox">
          <use xlink:href="#cb-inbox" />
        </svg>
        <span> cb-inbox</span>
    </li>
    <li>
        <svg class="cb cb-photo">
          <use xlink:href="#cb-photo" />
        </svg>
        <span> cb-photo</span>
    </li>
    <li>
        <svg class="cb cb-plus-square">
          <use xlink:href="#cb-plus-square" />
        </svg>
        <span> cb-plus-square</span>
    </li>
    <li>
        <svg class="cb cb-point">
          <use xlink:href="#cb-point" />
        </svg>
        <span> cb-point</span>
    </li>
    <li>
        <svg class="cb cb-tag">
          <use xlink:href="#cb-tag" />
        </svg>
        <span> cb-tag</span>
    </li>
    <li>
        <svg class="cb cb-tag-slash">
          <use xlink:href="#cb-tag-slash" />
        </svg>
        <span> cb-tag-slash</span>
    </li>
    <li>
        <svg class="cb cb-users">
          <use xlink:href="#cb-users" />
        </svg>
        <span> cb-users</span>
    </li>
    <li>
        <svg class="cb cb-minus-square">
          <use xlink:href="#cb-minus-square" />
        </svg>
        <span> cb-minus-square</span>
    </li>
    <li>
        <svg class="cb cb-close">
          <use xlink:href="#cb-close" />
        </svg>
        <span> cb-close</span>
    </li>
    <li>
        <svg class="cb cb-minus">
          <use xlink:href="#cb-minus" />
        </svg>
        <span> cb-minus</span>
    </li>
    <li>
        <svg class="cb cb-plus">
          <use xlink:href="#cb-plus" />
        </svg>
        <span> cb-plus</span>
    </li>
    <li>
        <svg class="cb cb-bars">
          <use xlink:href="#cb-bars" />
        </svg>
        <span> cb-bars</span>
    </li>
    <li>
        <svg class="cb cb-info-circle">
          <use xlink:href="#cb-info-circle" />
        </svg>
        <span> cb-info-circle</span>
    </li>
    <li>
        <svg class="cb cb-external-link">
          <use xlink:href="#cb-external-link" />
        </svg>
        <span> cb-external-link</span>
    </li>
    <li>
        <svg class="cb cb-logomark">
          <use xlink:href="#cb-logomark" />
        </svg>
        <span> cb-logomark</span>
    </li>
    <li>
        <svg class="cb cb-logotext">
          <use xlink:href="#cb-logotext" />
        </svg>
        <span> cb-logotext</span>
    </li>
</ul>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">
    $(function() {
        $.ajax({
          type: 'GET',
          url: './svg.html',
          dataType: 'html',
          success: function(data){
            $('body').prepend(data);
            },
          error: function() {
            console.log('error');
          }
        });
    });
</script>
</body>
</html>
